import React from 'react';

const getDisplayValue = (value, options = []) => {
  if (value === undefined || value === null) {
    return value;
  }
  const newValue = [].concat(value);
  return options
    .filter(item => newValue.includes(item.value))
    .map(item => item.label)
    .join(', ');
};

const Index = props => {
  const { value, options, render } = props;

  return (
    <>
      {render &&
        (render(getDisplayValue(value, options), {
          value,
          options,
        }) || <span>&nbsp;</span>)}
    </>
  );
};

export default Index;
